<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>lagou-job</title>
    <link rel="stylesheet" type="text/css" href="css/iview.css">
    <script type="text/javascript" src="js/vue.min.js"></script>
    <script type="text/javascript" src="js/iview.min.js"></script>
    <script type="text/javascript" src="js/axios.min.js"></script>
    <script type="text/javascript" src="js/common.js"></script>
</head>
<body>
<div id="app">
    <div class="layout">
        <i-layout>
            <i-header></i-header>
            <i-content>
                <Row>
                    <i-col span="24" style="text-align: center;">
                        <Tabs value="name2" style="width: 1200px;margin: 0 auto;">
                            <tab-pane label="24Hour热门" name="name2">
                                <Row v-for="item in list" style="margin-bottom: 10px">
                                    <i-col v-for="p in item.position" span="7" style="margin-left: 40px">
                                        <Card>
                                            <div @click="toPositionDetail(p.pcompany, p.pid)">
                                                <div>
                                                    <p style="float: left">{{p.pname}}<span>[{{p.ptime}}发布]</span></p>
                                                    <p style="float: right">{{p.psalaryMin}}-{{p.psalaryMax}}K</p>
                                                </div>
                                                <div style="clear: both;margin-bottom: 48px">
                                                    <p style="float: left;">经验{{p.pyearMin}}-{{p.pyearMax}}年/{{p.pedu}}</p>
                                                </div>
                                                <Divider dashed="true" style="clear: both"></Divider>
                                                <div>
                                                    <p style="float: left">{{p.companyName}}</p>
                                                </div>
                                                <div style="clear: both"></div>
                                            </div>
                                        </Card>
                                    </i-col>
                                </Row>
                            </tab-pane>
                        </Tabs>
                    </i-col>
                </Row>
            </i-content>
        </i-layout>
    </div>
</div>
<script>
    let app = new Vue({
        el: '#app',
        data: {
            list : [],
            userId: ""
        },
        mounted() {
            this.checkLogin();
        },
        methods: {
            /**
             * 校验登录状态
             */
            checkLogin() {
                let then = this;
                then.userId = window.localStorage.getItem("userId");
                if(then.userId) {
                    axios.get('/job/login/checkLogin', {
                            params : {
                                userId : then.userId
                            }
                        })
                        .then((rep) => {
                            if(rep.data.code == 0) {
                                then.getAllPosition();
                            } else {
                                window.location.href = "login.html";
                            }
                        })
                        .catch(function (error) {
                            console.log(error);
                        });
                } else {
                    window.location.href = "login.html";
                }
            },
            /**
             * 获得热门职位列表
             */
            getAllPosition() {
                let then = this;
                axios.get('/job/position/getHotPosition')
                    .then((rep) => {
                        if(rep.data.code == 0) {
                            let tempList = new Array();
                            let tempPosition = new Object();
                            let tempPositionList = new Array();
                            for (let i = 0; i < rep.data.data.length; i++) {
                                tempPositionList.push(rep.data.data[i]);
                                if((rep.data.data.length <= 3 && i == rep.data.data.length - 1) || ((i+1)%3 == 0)) {
                                    tempPosition.position = tempPositionList;
                                    tempList.push(tempPosition);
                                    tempPosition = new Object();
                                    tempPositionList = new Array();
                                }
                                if(rep.data.data.length > 3 && i == rep.data.data.length - 1) {
                                    tempPosition.position = tempPositionList;
                                    tempList.push(tempPosition);
                                }
                            }
                            then.list = tempList;
                        }
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
            /**
             * 跳转到职位详情页面 : 同时收集点击日志
             * @param jobCode 公司编码
             * @param pid 职位ID
             */
            toPositionDetail(jobCode, pid) {
                logCollect(this.userId, "click", jobCode);
                window.localStorage.setItem("pid", pid);
                window.location.href="detail.html";
            }
        }
    });
</script>
</body>
</html>
